<template>
	<view class="article-detail">
		<common-navbar title="文章详情"></common-navbar>
		<view class="article-detail-main">
			<view class="article-title">
				{{articleDetailData.title}}
			</view>
			<view class="article-info-wrapper">
				<view class="article-publisher">
					{{articleDetailData.summary}}
				</view>
				<view class="article-date">
					{{$u.timeFormat(articleDetailData.created_at, 'yyyy-mm-dd hh:MM:ss')}}
				</view>
			</view>
			<view class="article-content ql-editor">
				<u-parse :html="articleDetailData.content"  :show-with-animation="true" :lazy-load="true"></u-parse>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad(options) {
			this.articleId = options.id;
			this.getArticleDetail();
		},
		data() {
			return {
				articleId: '',
				articleDetailData: {
					title:'',
					content:'',
					created_at:'',
					summary:'',
				},
			}
		},
		methods: {
			async getArticleDetail() {
				const {
					data
				} = await this.$u.post(this.$restUrl.getArticleDetail, {
					article_id: this.articleId,
				})
				this.articleDetailData = data;
				console.log('文章详情数据>>>>>>>>>>>>>>>>', this.articleDetailData);
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "./articleDetail.scss"
</style>
